<!--
 * @details: 
 * @brief: 
 * @version: 1.0
 * @author: liuri
 * @Date: 2021-06-30 13:01:07
 * @LastEditors: liuri
 * @LastEditTime: 2021-06-30 14:07:49
 * @FilePath: /TestProject/htmlPath/javascript/test.html
 * Copyright (C) 2021 liuri. All rights reserved.
-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试实例</title>
<script type="text/javascript" src="spark-md5.js"></script>
<script>
function myFunction1(a)
{
    var fileReader = new FileReader(),
        blobSlice = File.prototype.mozSlice || File.prototype.webkitSlice || File.prototype.slice,	
		file = document.getElementById("addfile").files[0],		
        chunkSize = 2097152,
        // 计算chunk的个数
        chunks = Math.ceil(file.size / chunkSize),
        currentChunk = 0,
        spark = new SparkMD5();

    fileReader.onload = function(e) {
        console.log("read chunk nr", currentChunk + 1, "of", chunks);
        spark.appendBinary(e.target.result); // append binary string
        currentChunk++;

        if (currentChunk < chunks) {
            loadNext();
        }
        else {
            console.log("finished loading");
            // 得到Hash 值 spark.end()					
            console.info("computed hash", spark.end()); // compute hash
            return spark.end()
        }
    };
    

    loadNext();
}
// 加载一下个chunk
function loadNext() {
	var start = currentChunk * chunkSize,
		end = start + chunkSize >= file.size ? file.size : start + chunkSize;
	// 读取文件
	fileReader.readAsBinaryString(blobSlice.call(file, start, end));
};
function myFunction()
{
	var file = document.getElementById("addfile").files[0];
	a = myFunction1(file)
	console.log("test: ", a);
    alert("Hello World!");
}
</script>
</head>
 
<body>
    
<!--     内容      -->
<div id="content" class="white">
	<div class="bloc">	
		<!-- <form id="uploadform" method="POST" enctype="multipart/form-data" >		 -->
			<!-- 文件选择 -->
			<div style="width: 100px;margin: 10px 10px 10px 10px;">
				<input id="addfile" name="addfile" type="file" /> 
			</div>		 
			<!-- 下拉框 -->
			<div style="width: 100px;margin: 10px 10px 10px 10px;">
				<select>
					<option value ="video">video</option>
					<option value ="text">text</option>
					<option value="pdf">pdf</option>
					<option value="work">work</option>
				</select>
			</div>
			<!-- 下拉框 -->
			<div style="width: 100px;margin: 10px 10px 10px 10px;">
				<select>
					<option value ="study">学习</option>
					<option value ="inspirational">励志</option>
					<option value="classic">经典</option>
					<option value="comedy">好笑</option>
					<option value="othesr">其他</option>
				</select>
			</div>
					
			<div class="input textarea">
				<label for="textarea1">描述</label>
				<textarea id="text_id" name="area2" style="width: 100%; height:120px;">
				</textarea>
			</div>
			<div class="submit">
				<input type="submit" id="sure" value="确定" onClick="myFunction()">
			</div>
		<!-- </form> -->
	</div>
</div>
</body>
</html>